12.3:H212102 把太長的選單項目群組起來

不良設計

未在SELECT標籤中設定OPTGROUP屬性分類群組，使用者無法迅速找到所需的選單項目。

不良設計：

<FORM>
  <LABEL>產品</LABEL>
  <SELECT>
    <OPTION selected>起司麵包</OPTION>
    <OPTION>菠蘿麵包</OPTION>
    <OPTION>草莓麵包</OPTION>
    <OPTION>布丁麵包</OPTION>
    <OPTION>奶油布丁蛋糕</OPTION>
    <OPTION>冰淇淋蛋糕</OPTION>
    <OPTION>水果蛋糕</OPTION>
  </SELECT>
  </FORM>

範例結束

正確示範

在SELECT標籤中設定OPTGROUP屬性將選單項目適當地分類群組起來，有助於使用者迅速了解選單項目。

正確範例：

<FORM>
  <LABEL>產品</LABEL>
  <SELECT>
    <OPTGROUP label="麵包">
      <OPTION selected>起司麵包</OPTION>
      <OPTION>菠蘿麵包</OPTION>
      <OPTION>草莓麵包</OPTION>
      <OPTION>布丁麵包</OPTION>
    </OPTGROUP>
    <OPTGROUP label="蛋糕">
      <OPTION>奶油布丁蛋糕</OPTION>
      <OPTION>冰淇淋蛋糕</OPTION>
      <OPTION>水果蛋糕</OPTION>
    </OPTGROUP>
  </SELECT>
</FORM>

範例結束